import { Component, PureComponent } from "react";

export default class ClassComp extends Component {
  state = {
    count: 0,
  };

  setCount = () => {
    this.setState({
      // 不建议直接修改原数据
      count: this.state.count + 1,
    });
  };

  /*
    初始化渲染：
      constructor
      static getDerivedStateFromProps
      render
      componentDidMount 发送请求，设置定时器等任务
    更新渲染
      子组件setState
      父组件更新，导致子组件重新渲染
        static getDerivedStateFromProps
        shouldComponentUpdate 
          性能优化（比较新旧props和state的区别，如果没有区别，就不更新，有区别才更新）
          PureComponent 内部实现了新旧props和state浅比较
        componentWillUpdate
        render
        componentDidUpdate
    卸载
      componentWillUnmount 收尾，清除定时器解绑事件等
  */

  constructor(props: any) {
    super(props);
  }

  // static getDerivedStateFromProps() {}

  componentDidMount() {}

  render() {
    const { count } = this.state;
    return (
      <div>
        <h1>ClassComp</h1>
        <p>{count}</p>
        <button onClick={this.setCount}>+</button>
      </div>
    );
  }
}
